<%--
  Created by IntelliJ IDEA.
  User: brss
  Date: 2017/8/6
  Time: 9:32
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
<div class="panel-group">
    <div class="panel panel-primary">
        <div class="panel-heading">
            新增标签
        </div>
        <div class="panel-body">
            <div class="list-op" id="list_op">
                <button type="button" class="btn btn-default btn-sm" id="TagbackBtn">
                    <span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span>返回
                </button>
            </div>
        </div>
        <div class='alert alert-success' role='alert' id="succAlert" style="display: none">操作成功！</div>
        <div class='alert alert-danger' role='alert' id="failAlert" style="display: none">操作失败！</div>
        <form method="post" id="categoryForm">
            <div class="form-group">
                <input type="hidden" id="tagId" name="tagId" />
                <label>标签名称</label>
                <input type="text" class="form-control" id="tagName" name="tagName"/>
            </div>
            <div class="form-group">
                <label>标签描述</label>
                <input type="text" class="form-control" id="tagDescription" name="tagDescription"/>
            </div>
            <div class="form-group">
                <button type="button" class="btn btn-primary" id="submitTagFormBtn">提交</button>
            </div>
        </form>
        <div class="panel-footer"><!-- panel的foot -->
            <%--这是panel的footer--%>
        </div><!-- end of panel-footer -->
    </div><!-- end of panel -->
</div>

<script>
    $("#submitTagFormBtn").click(function (e) {
        //判断表单是否有效
        var bootstrapValidator = $('form').data('bootstrapValidator');
        //手动触发验证
        bootstrapValidator.validate();
        if(!bootstrapValidator.isValid())
            return;
        //判断是新增分类，还是修改分类
        if( $("#tagId").val().length == 0 ){
            //插入一条分类数据
            $.post("/tag/add",$("#categoryForm").serialize(), function(data){
                data = $.parseJSON( data );
                if(data.status == 200){
                    $("#succAlert").show();
                }else {
                    $("#failAlert").show();
                }
                //1.5秒后自动消失提示框
                setInterval("hideAlert()",2000);
            });
        }else{
            $.post("/tag/modify",$("#categoryForm").serialize(), function(data){
                data = $.parseJSON( data );
                if(data.status == 200){
                    $("#succAlert").show();
                }else {
                    $("#failAlert").show();
                }
                //1.5秒后自动消失提示框
                setInterval("hideAlert()",2000);
            });
        }
    });
    $("#TagbackBtn").click(function (e) {
        //history.back(-1);
        //感觉这种方法返回不是太好，给阅读者一种读不懂的感觉。
        //目前没有想到其他的方法。先用这个凑合
        $("#main-content").load("/admin/adminManageTag");
    });
    $(function () {
        $('form').bootstrapValidator({

            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },

            fields: {
                tagName: {
                    message: '名称验证失败',
                    validators: {
                        notEmpty: {
                            message: '名称不能为空'
                        }
                    }
                },
                tagDescription: {
                    validators: {
                        notEmpty: {
                            message: '描述不能为空'
                        }
                    }
                }
            }
        });
    });
    //隐藏Alert的函数
    function hideAlert() {
        $("#succAlert").hide();
        $("#failAlert").hide();
    }
</script>
</body>
</html>
